import { constantRoutes, asyncRoutes } from '@/router'
import { tranListToTreeData } from '@/utils'
export default {
  namespaced: true,
  state() {
    return {
      // 提供给侧边栏渲染使用，默认 静态路由配置
      // 最终  静态路由+用户的动态路由
      routes: [...constantRoutes]
    }
  },
  getters: {},
  mutations: {
    // 设置完整信息
    setRoutes(state, data) {
      // data是整理好的用户的动态路由
      state.routes = [...constantRoutes, ...data]
    }
  },
  actions: {
    // 思路1： 服务器端返回页面权限标识，和本地完整的动态路由的name进行匹配
    filterRoutes(context, menuMarks) {
      // asyncRoutes 是本地完整的动态路由  【已经是树】
      // menuMarks 是服务器端返回的标识  【一维数组，但是还没有整理成树】
      let userAsyncRoutes = []  // 用户的动态路由
      // 遍历完整的动态路由，判断路由的name是否在服务器端返回的标识里面
      asyncRoutes.forEach(item => {
        // item每个一级路由配置
        // 只处理了一级
        if (menuMarks.find(obj => obj.mark === item.name)) {
          // 有子级
          if (item.children && item.children.length) {
            // 存放子级 val是每个2级
            let temp = item.children.filter(val => {
              return menuMarks.find(o => o.mark === val.name)
            })
            // 重新确定儿子
            item.children = temp
          }
          userAsyncRoutes.push(item)
        }
      })
      // 设置给侧边栏
      context.commit('setRoutes', userAsyncRoutes)
      // 返回
      return userAsyncRoutes
    },
    // 思路2： 服务器端直接返回了用户的动态路由配置，整理数据
    generateRoutes(context, menuMarks) {
      // 需要的规则： path、hidden、name、component、meta(title,icon)、id、pid
      let userAsyncRoutes = []
      // 整理成路由要的数据
      menuMarks.forEach(item => {
        let obj = {}
        obj.meta = {
          title: item.title,
          icon: item.icon
        }
        obj.hidden = item.is_show !== 1
        obj.path = item.path
        if (item.component === 'layout') {
          obj.component = require('@/layout/index.vue').default
        } else {
          obj.component = require('@/views/' + item.component + '.vue').default
        }
        obj.id = item.id
        obj.pid = item.pid
        obj.name = item.mark
        userAsyncRoutes.push(obj)
      })
      // 变成树形结构
      userAsyncRoutes = tranListToTreeData(userAsyncRoutes, 0)
      // 给侧边栏
      context.commit('setRoutes', userAsyncRoutes)
      // 返回
      return userAsyncRoutes
    }
  }
}